import { AllHTMLAttributes, createElement, type FC } from 'react';
import classNames from 'classnames';

import { listListDefaultProps } from './defaultProps';
import type { ListListOptions } from './type';

export interface ListListProps extends ListListOptions, Omit<AllHTMLAttributes<HTMLElement>, 'as'> {}

const ListList: FC<ListListProps> = (props) => {
  const { className, as, children, forwardedRef, ...listListProps } = props;

  return createElement(
    as!,
    { ref: forwardedRef, className: classNames({ list: as !== 'ul' && as !== 'ol' }, className), ...listListProps },
    children,
  );
};

ListList.displayName = 'ListList';
ListList.defaultProps = listListDefaultProps;

export default ListList;
